<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>鲜花类型列表</title>
		<link rel="stylesheet" href="../res/layui/css/layui.css" media="all">
		<script src="../res/js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript" src="../res/js/Tools.js"></script>
		<script src="../res/layui/layui.js" charset="utf-8"></script>
		<script>
			$.ajaxSetup({
				async : false
			});
		</script>
	</head>
	<div class="demoTable">
		<table class="layui-hide" id="test" lay-filter="test"></table>
		<div id="laypage"></div>
	</div>

	<script>
	var table2;
	layui.use(['layer','table','form','jquery'],function(){
		//获取table数据保存在变量中
		var table=layui.table;
		var layer=layui.layer;
		var form=layui.form;
		var $=layui.$;
		var index;
		table2=table.render({
			elem:'#test',
			url:'../flowertype/findAll',
			toolbar:'#headBtn', //开启头部工具栏，并为其绑定左侧模板
			title:'鲜花类型列表',
			cellMinWidth: 80, //全局定义常规单元格的最小宽度，layui 2.2.1 新增
			cols:[[
				{type: 'checkbox', title: '全选', fixed: 'left'},
				 //是否禁用拖拽列宽（默认false）unresize:true,是否禁用排序sort:true
				{type: 'numbers',align:'center', title: '序号'},//序列号 numbers
				{field:'ftName',align:'center',title:'鲜花类型名称',width:140},
				{field:'ftNeirong',align:'center',title:'鲜花类型内容',width:200},
				{field:'right',align:'center',title:'操作',toolbar:'#barDemo',width:220}
			]]
			,id:'tableReload'//重载数据表格
			,page:true//开启分页
		});


		//监听头部工具栏事件
		table.on('toolbar(test)',function(obj){
			var  checkStatus =table.checkStatus(obj.config.id),data=checkStatus.data;//获取选中的数据
		    switch(obj.event){
				 case 'delAll': //批量删除
					layer.confirm('你真的要删除吗？',function(index){
							var data=checkStatus.data;
							var ids="";
							$.each(data,function(index,item){
								ids+=item.ftId+",";
							});
							if(ids.length==0){
								layer.msg("请选择需要操作的行");
								return;
							}
							var url="../flowertype/delAll";
							var datas={
								ids:ids
							};
							$.post(url,datas,function(obj){
								window.location.reload();
								layer.msg(obj.msg);
							},"json");
							});
							break;
					case 'seachTable':	//搜索
						//执行重载
						table2.reload({
							url:'../flowertype/findAll',
							where:{
								ftName:$("#ftName").val()
							},
							page:{
								curr:1 //第一页开始
							}
						});
						break;
					case 'add'://新增
					var index=layer.open({
							   type:2,
							   title:'新增鲜花类型',
							   shadeClose:true,
							   shade:0.8,
							   area:['30%','40%'],
							   content:'flowertypeAddorUpdate.html',
							   end:function(){

						   }
					   });
						break;
		   };
		});		
		//监听行工具事件
		table.on('tool(test)',function(obj){
			 var data = obj.data; //获得当前行数据
			 var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
			 var tr = obj.tr; //获得当前行 tr 的 DOM 对象 
			 if(layEvent=='del'){  //删除
			 	layer.confirm('真的删除id：'+data.ftName+'的数据吗？',function(index){
			 		var url='../flowertype/del';
			 		var datas={ftId:data.ftId};
			 		$.post(url,datas,function(obj){
			 			if(obj.num==1){
			 				layer.msg(obj.msg,{ icon:1,time:1000 },function () {
								layer.close(index);//关闭层
								//parent.location.reload();//刷新主界面
								//$(".layui-laypage-btn").click();
			 				});
						}else if(obj.num==-1){
			 				layer.msg(obj.msg,{icon:2},function () {
								layer.close(index);
								window.location.reload();
							});
			 			}

			 		},"json");
					obj.del(); //删除对应行（tr）的DOM结构，并更新缓存
			 	});
			 }
			 if(layEvent=='details'){ //查看
					 var  data2=obj.data;
				     var index=layer.open({
						 type:2,
						 title:'查看鲜花类型',
						 shadeClose:true,
						 shade:0.8,
						 area:['30%','60%'],
						 content:'flowertypeAddorUpdate.html?id='+data2.ftId,
						 end:function(){

						 }
					 });
				 //layer.msg('id：' + data2.ftName + ' 的查看操作');
			 }
			 if(layEvent=='edit'){ //编辑
				 var  data1=obj.data;
				var index=layer.open({
					 type:2,
					 title:'编辑鲜花类型',
					 shadeClose:true,
					 shade:0.8,
					 area:['30%','40%'],
					 content:'flowertypeAddorUpdate.html?id='+data1.ftId,
					 end:function(){

					 }
				 });
			 }
		});



	});
	</script>
	</body>
	<script type="text/html" id="headBtn">
	    鲜花类型名称:
	    <div class="layui-inline">
	        <input class="layui-input" name="ftName" id="ftName" placeholder="请输入关键字" autocomplete="off">
	    </div>
	    <input type="button" lay-event="seachTable" class="layui-btn layui-btn-normal layui-btn-sm" value="搜索"/>
	    <button class="layui-btn layui-btn-danger layui-btn-sm" lay-event="delAll">批量删除</button>
	    <button type="button" class="layui-btn layui-btn-normal layui-btn-sm" lay-event="add" id="addflowertype">增加</button>
	</script>
	<script type="text/html" id="barDemo">
		<a class="layui-btn layui-btn-xs" lay-event="details">查看</a>
	    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑 </a>
	    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
	</script>
</html>
